(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "react", "controls/item-dialog", "services/dataSources", "controls/wz-ext"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    const React = require("react");
    const item_dialog_1 = require("controls/item-dialog");
    const dataSources_1 = require("services/dataSources");
    const wz_ext_1 = require("controls/wz-ext");
    // export default function (page: Page) {
    //     let shopping = page.createService(ShoppingService);
    //     let activity = page.createService(ActivityService);
    //     ReactDOM.render(<BrandListPage />, page.element);
    // }
    class BrandListPage extends React.Component {
        constructor(props) {
            super(props);
            // this.shopping = dataSources.brand;
        }
        showDialog(item) {
            item = item || {};
            let title = item ? "编辑品牌" : "添加品牌";
            this.brandDialog.show(item, title, (item) => {
                item.Id ? dataSources_1.dataSources.brand.update(item) : dataSources_1.dataSources.brand.insert(item);
            });
        }
        tableRef(e) {
            if (!e || this.tableElement)
                return;
            this.tableElement = e;
            let gridView = wz_ext_1.createGridView({
                element: this.tableElement, dataSource: dataSources_1.dataSources.brand, columns: [
                    new wz_ext_1.BoundField({
                        dataField: 'Name', sortExpression: 'Name', headerText: '名称',
                        itemStyle: { width: '200px' },
                        headerStyle: { textAlign: 'center' }
                    }),
                    new wz_ext_1.BoundField({
                        dataField: 'Image', headerText: '图片',
                        headerStyle: { textAlign: 'center' }
                    }),
                    new wz_ext_1.CommandField({
                        headerText: '操作',
                        headerStyle: { textAlign: 'center', width: '100px' },
                        itemStyle: { textAlign: 'center' },
                    })
                ]
            });
        }
        render() {
            return React.createElement(React.Fragment, null,
                React.createElement("div", { className: "tabbable" },
                    React.createElement("ul", { className: "nav nav-tabs" },
                        React.createElement("li", { className: "pull-right" },
                            React.createElement("button", { className: "btn btn-sm btn-primary", onClick: () => this.showDialog() },
                                React.createElement("i", { className: "icon-plus" }),
                                React.createElement("span", null, "\u6DFB\u52A0"))))),
                React.createElement("table", { className: "table table-striped table-bordered table-hover", ref: this.tableRef.bind(this) }),
                React.createElement(BrandDialog, { ref: e => this.brandDialog = e || this.brandDialog }));
        }
    }
    exports.default = BrandListPage;
    class BrandDialog extends item_dialog_1.ItemDialog {
        render() {
            return React.createElement(React.Fragment, null,
                React.createElement("div", { className: "form-group clearfix" },
                    React.createElement("label", { className: "col-sm-2" }, "\u540D\u79F0"),
                    React.createElement("div", { className: "col-sm-10" },
                        React.createElement("input", { name: "Name", type: "text", className: "form-control" }))),
                React.createElement("div", { className: "form-group clearfix" },
                    React.createElement("label", { className: "col-sm-2" }, "\u56FE\u7247"),
                    React.createElement("div", { className: "col-sm-10" },
                        React.createElement("input", { name: "Image", type: "text", className: "form-control" }))));
        }
    }
});
